/**
 * Created by rui on 2015/1/26.
 */
LsSlider.initialize({});

var $CurrentH = 0,
    $CurrentV = 0;
LsSlider.addEventListener("beforeslide", function(event) {
    var $direction = event.direction;
    if($CurrentH === 0 && $CurrentV === 0) {

    }
    else if($CurrentH === 0 && $CurrentV === 1) {

    }
    else if($CurrentH === 0 && $CurrentV === 2) {

    }
    else if($CurrentH === 0 && $CurrentV === 3) {

    }
});

function init(){
    var userActionAvailable = false;
    var lsProgress = document.querySelector("#lsProgress");
    lsProgress.style.display = "block";
    LsSlider.slidePause();
// 正在加载进度条，不允许用户操作。
    userActionAvailable = false;

    var _start = function (evt) {
        evt.preventDefault();
    };
    document.body.addEventListener("touchstart", _start, false);

    var progressTimeout = setTimeout(function () {

        LsSlider.slidePause();
        // 正在加载进度条，不允许用户操作。
        userActionAvailable = false;

        lsProgress.style.opacity = 1;
        lsProgress.style.transition = "opacity .4s ease-in-out";
        lsProgress.style.webkitTransition = "opacity .4s ease-in-out";
        lsProgress.style.mozTransition = "opacity .4s ease-in-out";
        lsProgress.style.oTransition = "opacity .4s ease-in-out";

        var progressBegin = setTimeout(function () {
            lsProgress.querySelectorAll("div")[0].classList.add("expand");
            var progressEnd = setTimeout(function () {
                var stages = document.getElementsByClassName("stage");
                for(var s = 0; s < stages.length; s++) {
                    stages[s].style.display = "block";
                }
                // 进度条加载完成
                lsProgress.style.opacity = 0;
                var tips = document.querySelector("#tips");
                tips.style.transition = "opacity .4s ease-in-out";
                tips.style.webkitTransition = "opacity .4s ease-in-out";
                tips.style.mozTransition = "opacity .4s ease-in-out";
                tips.style.oTransition = "opacity .4s ease-in-out";
                var progressHidden = setTimeout(function () {
                    document.body.removeEventListener("touchstart", _start);
                    lsProgress.style.display = "none";
                    LsSlider.slideRestart();
                    document.getElementsByClassName("arrow")[0].style.display = "block";
                    userActionAvailable = true;
                    tips.style.opacity = 1;
                    demo2Init();
                    clearTimeout(progressHidden);
                    clearTimeout(progressEnd);
                    clearTimeout(progressBegin);
                    clearTimeout(progressTimeout);
                }, 400);
            }, 2500);
        }, 400);
    }, 1000);
}

LsSlider.addEventListener("slidechanged", function (event) {
    var $indexh = event.indexh,
        $indexv = event.indexv;
    var $direction = event.direction;

    if($indexh === 0 && $indexv === 0) {
        if($isSubmit == 0){
            $("#getBtn").css({"display":"block"});
            $("#section1_1").css({"background-image":"url('./images/demo2/1/background.jpg')"});
        }
        $("#myArrow").attr("src","./images/demo2/1/arrow.png");
        $("#myArrow").parent().css({"width":"10%"});
        $("#myArrow").parent().css({"left":"45%"});
    }
    else if($indexh === 0 && $indexv === 1) {
        $("#info").css({"display":"none"});
        $("#getBtn").css({"display":"none"});
        $("#myArrow").attr("src","./images/demo2/4/arrow.png");
        $("#myArrow").parent().css({"width":"60%"});
        $("#myArrow").parent().css({"left":"20%"});
    }
    else if($indexh === 0 && $indexv === 2) {
        $("#getBtn").css({"display":"none"});
        $("#myArrow").attr("src","./images/demo2/5/arrow.png");
        $("#myArrow").parent().css({"width":"60%"});
        $("#myArrow").parent().css({"left":"20%"});
    }
    else if($indexh === 0 && $indexv === 3) {
        $("#getBtn").css({"display":"none"});
    }
    $CurrentH = $indexh;
    $CurrentV = $indexv;

    if($CurrentV === event.lastVertical) {
        document.querySelectorAll(".arrow")[0].style.opacity = 0;
    }
    else {
        document.querySelectorAll(".arrow")[0].style.opacity = 1;
    }
    event.setTouchEndDelay(50);
});

init();